<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script>
        /**
        * 把平铺的数组结构转成树形结构
            */
        // 'pid': '' ：说明当前是一级数据，没有父级
        // 'pid': '2c': pid后面的值不为空，说明有父级，父级对象指向的id=pid的对象
        //  此时父级对象指向---》  { 'id': '2c', 'pid': '', 'name': '财务部' },
        //  根据数据之间关系，最终生成的树形结构如下
        // [
        //   { 'id': '29', 'pid': '', 'name': '总裁办' }, 
        //   { 'id': '2c', 'pid': '', 'name': '财务部',children:
        //         [
        //         { 'id': '2d', 'pid': '2c', 'name': '财务核算部' },
        //         { 'id': '2f', 'pid': '2c', 'name': '薪资管理部' },
        //         ] 
        //    },
        //    { 'id': 'd2', 'pid': '', 'name': '技术部',children:
        //         [
        //           { 'id': 'd3', 'pid': 'd2', 'name': 'Java研发部' }
        //         ] },
        //  ]
     
       
        
        // 函数版 
        function tranListToTreeList(arr){
            //  创建一个空对象，目的就是为了建立映射关系，---》快速找到对象---根据id找对象
            const map = {}
            // 1. 遍历所有的数据，给每一个对象添加一个children
            arr.forEach(item=> {
            item.children = [] 
            //  2. 往映射对象中添加数据id为健 值是对象  
            map[item.id] = item
            })
            // map = {
            //     2c: {id: '2c', pid: '', name: '财务部', children: Array(0)},
            //     2d: {id: '2d', pid: '2c', name: '财务核算部', children: Array(0)},
            //     2f: {id: '2f', pid: '2c', name: '薪资管理部', children: Array(0)},
            //     29: {id: '29', pid: '', name: '总裁办', children: Array(0)},
            //     d2: {id: 'd2', pid: '', name: '技术部', children: Array(0)},
            //     d3: {id: 'd3', pid: 'd2', name: 'Java研发部', children: Array(0)}
            // }
            // 3. 根据关系进行转化
            const newArr = []
            arr.forEach(item=> {
                // 先根据item.pid 找对应的父级
                const parent = map[item.pid]    // item.pid= d2
                if (parent) {
                    // 找到了父级，将item添加到父级的children属性中
                    parent.children.push(item)
                } else {
                    // 说明item是一级的数据，没有父级
                    newArr.push(item)
                }

            })

            return newArr

        }

        const arr =  [
            { 'id': '2d', 'pid': '2c', 'name': '财务核算部' },
            { 'id': '2f', 'pid': '2c', 'name': '薪资管理部' },
            { 'id': '29', 'pid': '', 'name': '总裁办' },
            { 'id': '2c', 'pid': '', 'name': '财务部' },
            { 'id': 'd2', 'pid': '', 'name': '技术部' },
            { 'id': 'd3', 'pid': 'd2', 'name': 'Java研发部' }
         ]
       console.log( tranListToTreeList(arr));
     


    </script>
</head>

<body>

</body>

</html>